<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>我的项目</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <link rel="stylesheet" type="text/css" href="../../css/sm.min.css">
    <link rel="stylesheet" type="text/css" href="../../css/normal.css" />
    <link rel="stylesheet" type="text/css" href="../../css/project.css" />
    <link rel="stylesheet" type="text/css" href="../../iconfont/iconfont.css" />
</head>

<body>
    <div class="page allWarp">
        <div class="content">
            <div class="projectBox">
                <div class="projectContent" v-for="item in projectData" onclick="moveto()" :data-projectCode="item.projectCode" :data-status="item.status">
                    <div class="projectTop">
                        <ul>
                            <li>
                                <span class="col999 width20">项目名称：</span>
                                <span class="col36 width80" v-text="item.projectName"></span>
                            </li>
                            <li>
                                <span class="col999 width20">项目日期：</span>
                                <span class="col36 width80" v-text="capitalize(item.createTime)"></span>
                            </li>
                            <li>
                                <span class="col999 width20">客户姓名：</span>
                                <span class="col36 width80" v-text="item.customerName"></span>
                            </li>
                            <li>
                                <span class="col999 width20">客户电话：</span>
                                <span class="col36 width80" v-text="item.customerPhone"></span>
                            </li>
                            <li>
                                <span class="col999 width20">客户地址：</span>
                                <span class="col36 width80" v-text="item.customerAddress"></span>
                            </li>
                        </ul>
                    </div>
                    <div class="projectBottom">
                        <span class="width20 col36">
                            <span v-text="item.nodeName" v-if="item.nodeName != null"></span>
                            <span v-if="item.nodeName == null">待派工</span>
                        </span>
                        <span class="width80 col999 font12" style="display: flex; align-items: center;justify-content: space-between;">
                            <span>
                                <p v-text="capitalize(item.nodeLogTime)" v-if="item.nodeLogTime != null"></p>
                                <!-- <p v-text="capitalize(item.createTime)" v-if="item.nodeLogTime == null"></p> -->
                                <p v-text="item.description"></p>
                            </span>
                            <span>
                                <i class="iconfont icon-arrow-right right10"></i>
                            </span>
                        </span>
                    </div>
                </div>
                <div v-if="projectData.length == 0&&isEmpty == true" class="textcenter" style="margin-top: 5rem;">
                    <span class="font18 labelTxt">暂无项目相关信息</span>
                </div>
                <!-- 加载提示符 -->
                <div class="infinite-scroll-preloader">
                    <div class="preloader"></div>
                </div>
            </div>
            <div class="addProject" v-if="showRole" onclick="move()">新建项目</div>
        </div>
    </div>
    <script type="text/javascript" src="../../js/zepto.js"></script>
    <script type="text/javascript" src="../../js/sm.min.js"></script>
    <script type="text/javascript" src="../../js/vue.min.js"></script>
    <script type="text/javascript" src="../../js/ajax.js"></script>
    <script type="text/javascript" src="../../js/back.js"></script>
    <script type="text/javascript">
        var role = GetQueryString("role"); // 1 销售进入 2 客户进入
        
        if (role == 1) {
            var keyN = JSON.parse(getCookie("user_data_two"));
        } else if(role == 2){
            var keyN = JSON.parse(getCookie("user_data_one"));
        }
        var createUid;
        var customerPhone;
        if (keyN != null) {
            createUid = keyN.userId;
            customerPhone = keyN.customerPhone;
        }
        console.log(createUid)

        var demo = new Vue({
            el: '.allWarp',
            data: {
                isEmpty: false,
                projectData: [],
                pageNumber: 1,
                pageSize: 10,
                totalNum: 0,
                loading:false,
                showRole:true,
            },
            beforeCreate: function() {
                init();
            }
        })
        if (role == 1) {
            demo.showRole = true;
            document.title = '我的项目';
        } else {
            demo.showRole = false;
            document.title = '项目查询';
        }
        // 节点列表
        function init(){
            var params = {};
            if(role == 1){
                params.createUid = createUid;
            }
            if(role == 2){
                params.customerPhone = customerPhone;
            }
            kfAjaxGet.projectList(params, function(json) {
                if (json.code == 200) {
                    var data = json.data;

                    demo.loading = false;
                    demo.totalNum = data.totalElements;
                    if (data.pageContent == null) {
                        demo.isEmpty = true;
                        demo.projectData = [];
                    } else {
                        demo.isEmpty = false;
                    }
                    demo.projectData.push.apply(demo.projectData, data.pageContent);

                    if (demo.projectData.length >= demo.totalNum) {
                        $('.infinite-scroll-preloader').hide();
                    } else {
                        $('.infinite-scroll-preloader').show();
                    }
                    console.log(json)
                } else if (checkcode(json.code)) {

                } else {
                    $.toast(json.message);
                }
            })
        }
        function foreverPull() {
            $(document).on('infinite', function() {
                if (demo.loading) return;
                demo.loading = true;
                // 判断是否为还有数据
                if (demo.projectData.length >= demo.totalNum) {
                    // 销毁无限加载事件
                    $.detachInfiniteScroll($('.infinite-scroll'));
                    // 移除加载提示符
                    $('.infinite-scroll-preloader').hide();
                    return;
                }
                setTimeout(function() {
                    demo.pageNumber++;
                    init();
                    $.refreshScroller();
                }, 500)
            });
        }
        //跳转到详情
        function moveto(){
            var _that = $(event.currentTarget);
            var projectCode = _that.attr("data-projectCode");
            var status = _that.attr("data-status");
            if (status == 1) {
                window.location = 'creatProject2.html?projectCode='+projectCode+'&role='+role;
            } else{
                window.location = 'projectDetail.html?projectCode='+projectCode+'&showDetail=1'+'&role='+role;
            }
            
        }
        //跳转新建项目
        function move(){
            sessionStorage.removeItem('creatProject_data');
            window.location = 'creatProject.html?role='+role;
        }

        $(function(){
            $('#gohome').on('click',function(){
                window.location = 'myProject.html?role='+role;
            })
        })

        $.init();
    </script>
</body>
</html>